// 操作过程：
// 引入或者加载jquey模块
import { } from "https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.js";

// 点击登录按钮，将用户名和密码传输给后端
const $btn = $('.log_btn');//登录按钮
const $tel = $('.log_tel');//登录手机
const $pass = $('.log_pass');//登录密码

const $tel_hint = $(".log_tel_hint");//电话提示字
const $pass_hint = $(".log_pass_hint");//密码提示字


let $telflag = true;
let $passflag = true;


$btn.on('click', function () {
    if ($tel.val() === "") {
        $tel_hint.html("手机号码不能为空");
        $tel_hint.css({ color: "red" });
        $telflag = false;
    }

    if ($pass.val() === "") {
        $pass_hint.html("密码不能为空");
        $pass_hint.css({ color: "red" });
        $passflag = false;
    }
    if (!$telflag || !$passflag) {
        return false;
    } else {
        $.ajax({
            type: 'post',
            url: 'http://10.31.165.61/JS2012/mall360/php/login.php',
            data: {
                tel: $tel.val(),
                pass: $pass.val()
            }
        }).done(function (data) { //data:后端返回的值
            if (data === 'true') { //登录成功:跳转首页，同时首页应该出现用户名等信息(本地存储)。
                window.localStorage.setItem('loginname', $tel.val());
                location.href = 'index1.html';
            } else { //登录失败
                $pass_hint.html("用户名或者密码错误");
                $pass_hint.css({ color: "red" });
                $pass.val(""); //清空密码
            }
        });
    }
});


//判断手机
$tel.on("blur", function () {
    if ($tel.val() !== "") {
        var reg = /^1[35789]\d{9}$/;
        if (reg.test($tel.val())) {
            $tel_hint.html("");
            $telflag = true;
        } else {
            $tel_hint.html("手机号码格式有误");
            $tel_hint.css({ color: "red" });
            $telflag = false;

        }
    } else {
        $tel_hint.html("手机号码不能为空");
        $tel_hint.css({ color: "red" });
        $telflag = false;
    }
});

//判断密码
$pass.on("blur", function () {
    if ($pass.val() !== "") {
        if ($pass.val().length >= 8 && $pass.val().length <= 20) {
            $pass_hint.html("");
            $passflag = true;
        } else {
            $pass_hint.html("密码长度有误");
            $pass_hint.css({ color: "red" });
            $passflag = false;
        }
    } else {
        $pass_hint.html("密码不能为空");
        $pass_hint.css({ color: "red" });
        $passflag = false;
    }
});

